<!--  -->
<template>
  <div>
    <EditPageTitle :titleLabel="view_title_label" />
    <div class="editContentPage">
      <div class="inputLine">
        <label>装备名称</label>
        <input type="text" v-model="mFormData.title" />
      </div>
      <div class="inputLine">
        <label>英文名称</label>
        <input type="text" v-model="mFormData.en_title" />
      </div>
      <div class="type_name">
        <span>概况</span>
      </div>
      <div class="inputLine">
        <label>制造商</label>
        <input type="text" v-model="mFormData.param_zhizaoshang" />
      </div>
      <div class="inputLine">
        <label>检测类别</label>
        <input type="text" v-model="mFormData.jianceleibie" />
      </div>
      <div class="inputLine">
        <label>检测原理</label>
        <input type="text" v-model="mFormData.jianceyuanli" />
      </div>
      <div class="inputLine">
        <label>检测方法</label>
        <input type="text" v-model="mFormData.jiancefangfa" />
      </div>
      <div class="inputLine">
        <label>应用</label>
        <input type="text" v-model="mFormData.yingyong" />
      </div>
      <div class="inputLine">
        <label>设备类型</label>
        <input type="text" v-model="mFormData.shebeileixing" />
      </div>
      <div class="inputLine">
        <label>产品简介</label>
        <input type="text" v-model="mFormData.chanpingjianjie" />
      </div>
      <div class="inputLine">
        <label>可用性</label>
        <input type="text" v-model="mFormData.keyongxing" />
      </div>
      <div class="inputLine">
        <label>技术成熟度级别（TRL）</label>
        <input type="text" v-model="mFormData.jishuchengshudujibie" />
      </div>

      <div class="type_name">
        <span> 物理参数 </span>
      </div>
      <div class="inputLine">
        <label>外形尺寸</label>
        <input type="text" v-model="mFormData.waixingchicun" />
      </div>
      <div class="inputLine">
        <label>重点</label>
        <input type="text" v-model="mFormData.zhongdian" />
      </div>
      <div class="inputLine">
        <label>电源需求</label>
        <input type="text" v-model="mFormData.dinayuanxuqiu" />
      </div>

      <div class="type_name">
        <span>后勤参数</span>
      </div>

      <div class="inputLine">
        <label>可运输性</label>
        <input type="text" v-model="mFormData.dinayuanxuqiu" />
      </div>
      <div class="inputLine">
        <label>强度</label>
        <input type="text" v-model="mFormData.qiangdu" />
      </div>
      <div class="inputLine">
        <label>工作条件 </label>
        <input type="text" v-model="mFormData.gongzuotiaojian" />
      </div>
      <div class="inputLine">
        <label>耗材 </label>
        <input type="text" v-model="mFormData.haocai" />
      </div>
      <div class="inputLine">
        <label>溶剂/试剂 </label>
        <input type="text" v-model="mFormData.rongjishiji" />
      </div>
      <div class="inputLine">
        <label>数据分析支持设备</label>
        <input type="text" v-model="mFormData.shujufenxizhichishebei" />
      </div>
      <div class="inputLine">
        <label>通信接口</label>
        <input type="text" v-model="mFormData.tongxinjiekou" />
      </div>
      <div class="inputLine">
        <label>预期使用寿命 </label>
        <input type="text" v-model="mFormData.yuqishiyongshouming" />
      </div>

      <div class="type_name">
        <span>操作参数</span>
      </div>
      <div class="inputLine">
        <label>其他生物目标 </label>
        <input type="text" v-model="mFormData.qitashengwumubiao" />
      </div>
      <div class="inputLine">
        <label>进样 </label>
        <input type="text" v-model="mFormData.jinyang" />
      </div>
      <div class="inputLine">
        <label>启动时间 </label>
        <input type="text" v-model="mFormData.qidongshijian" />
      </div>
      <div class="inputLine">
        <label>响应时间 </label>
        <input type="text" v-model="mFormData.xiangyingshijian" />
      </div>
      <div class="inputLine">
        <label>总运行时间 </label>
        <input type="text" v-model="mFormData.zongyunxingshijian" />
      </div>
      <div class="inputLine">
        <label>报警功能 </label>
        <input type="text" v-model="mFormData.baojinggoneneng" />
      </div>
      <div class="inputLine">
        <label>软件控制 </label>
        <input type="text" v-model="mFormData.ruanjinakongzhi" />
      </div>

      <div class="type_name">
        <span> 培训、运输和其他信息 </span>
      </div>
      <div class="inputLine">
        <label>培训要求 </label>
        <input type="text" v-model="mFormData.peixunyaoqiu" />
      </div>
      <div class="inputLine">
        <label>操作手册 </label>
        <input type="text" v-model="mFormData.caozuoshouce" />
      </div>
    </div>
    <EditButton @saveDraft="saveDraft" @saveUp="saveAndUp"></EditButton>
  </div>
</template>

<script>
import EditInputLine from "../../Public/EditInputLine.vue";
export default {
  data() {
    return {
      view_title_label: "生物检测装备",
      mFormData: {
        title: "",
        en_title: "",
        param_zhizaoshang: "",
        jianceleibie: "",
        jianceyuanli: "",
        jiancefangfa: "",
        yingyong: "",
        shebeileixing: "",
        chanpingjianjie: "",
        keyongxing: "",
        jishuchengshudujibie: "",
        waixingchicun: "",
        zhongdian: "",
        dinayuanxuqiu: "",
        keyunshuxing: "",
        qiangdu: "",
        gongzuotiaojian: "",
        haocai: "",
        rongjishiji: "",
        shujufenxizhichishebei: "",
        tongxinjiekou: "",
        yuqishiyongshouming: "",
        qitashengwumubiao: "",
        jinyang: "",
        qidongshijian: "",
        xiangyingshijian: "",
        zongyunxingshijian: "",
        baojinggoneneng: "",
        ruanjinakongzhi: "",
        peixunyaoqiu: "",
        caozuoshouce: "",
      },
    };
  },
  components: { EditInputLine },
  computed: {},
  mounted() {
    // 路由传递的类型参数  新增：add  编辑：edit 草稿箱编辑：draftEdit
    const type = this.$route.params.type;
    switch (type) {
      case "add":
        this.view_title_label = this.view_title_label + "新增";
        this.env = "add";
        break;
      case "edit":
        this.view_title_label = this.view_title_label + "编辑";
        this.env = "edit";
        this.getData();
        break;
      case "draftEdit":
        this.view_title_label = this.view_title_label + "草稿编辑";
        this.env = "draft";
        this.getData();
        break;
      default:
        break;
    }
    // 路由传递的参数id
    const id = this.$route.params.id;
  },
  methods: {
    getData() {
      this.$api.data
        .equipEdit({
          params: {
            id: this.$route.params.id,
          },
        })
        .then((res) => {
          console.log(res);
          this.mFormData = Object.assign({}, res.data.data);
        });
    },
    saveAndUp() {
      if (this.mFormData.title == "") {
        this.$message.error("标题不能为空");
        return;
      }
      if (this.env == "edit") {
        //编辑后保存并上架
        this.$api.data
          .equipSave(
            Object.assign(
              {},
              {
                id: this.$route.params.id,
                statu: "Y",
                draft: "N",
                c_type: "jiance",
              },
              this.mFormData
            )
          )
          .then((res) => {
            if (res.data.statu == 0) this.succeedBack();
          });
      } else if (this.env == "add") {
        //新增
        this.$api.data
          .equipSave(
            Object.assign(
              {},
              {
                statu: "Y",
                draft: "N",
                c_type: "jiance",
              },
              this.mFormData
            )
          )
          .then((res) => {
            if (res.data.statu == 0) this.succeedBack();
          });
      } else if (this.env == "draft") {
        //草稿编辑
        this.$api.data
          .equipSave(
            Object.assign(
              {},
              {
                id: this.$route.params.id,
                statu: "Y",
                draft: "N",
                c_type: "jiance",
              },
              this.mFormData
            )
          )
          .then((res) => {
            if (res.data.statu == 0) this.succeedBack();
          });
      }
    },
    saveDraft() {
      if (this.mFormData.title == "") {
        this.$message.error("标题不能为空");
        return;
      }
      if (this.env == "edit") {
        //编辑后保存为草稿
        this.$api.data
          .equipSave(
            Object.assign(
              {},
              {
                id: this.$route.params.id,
                statu: "N",
                draft: "Y",
                c_type: "jiance",
              },
              this.mFormData
            )
          )
          .then((res) => {
            // console.log(res);
            if (res.data.statu == 0) this.succeedBack();
          });
      } else if (this.env == "add") {
        //新增后保存为草稿
        this.$api.data
          .equipSave(
            Object.assign(
              {},
              {
                draft: "Y",
                statu: "N",
                c_type: "jiance",
              },
              this.mFormData
            )
          )
          .then((res) => {
            if (res.data.statu == 0) this.succeedBack();
          });
      } else if (this.env == "draft") {
        //草稿编辑后保存为草稿
        this.$api.data
          .equipSave(
            Object.assign(
              {},
              {
                id: this.$route.params.id,
                draft: "Y",
                statu: "N",
                c_type: "jiance",
              },
              this.mFormData
            )
          )
          .then((res) => {
            if (res.data.statu == 0) this.succeedBack();
          });
      }
    },
    succeedBack() {
      this.$router.go(-1);
    },
  },
};
</script>
<style  scoped>
.equip_cn_title label {
  color: #0050b2;
}
.type_name {
  margin-left: auto;
  margin-right: auto;
  margin-top: 24px;
  width: 692px;
  height: 1px;
  text-align: center;
  background-color: #a6b2cd;
}
/* .type_name::after {
  content: "";
  display: block;
  width: 100%;
  height: 1px;

  top: 8px;
  margin-top: -8px;
  z-index: 0;
} */
.type_name > span {
  font-size: 16px;
  line-height: 16px;
  padding: 0 8px;
  position: relative;
  top: -8px;
  background-color: #fff;
  color: #0050b2;
}
</style>